<template>
  <div :style="bottomStaySpace()" class="wrap">
    <div class="title">营业执照上传</div>
    <div style="margin: 24rpx 68rpx 16rpx 72rpx">
      <Upload :default-file="form.businessLicense" :file-style="{width: '562rpx', height: '352rpx'}" update @file="form.businessLicense = $event">
        <Image height="352" name="businessLicenseBG" oss type="png" width="562" />
      </Upload>
      <div class="tip">支持上传：png、jpg、jpeg</div>
    </div>
    <Image :styles="{marginTop: '52rpx'}" height="2388" name="holdMainBody/ebusiness_license_download_process" oss type="png" width="702" />
    <div :style="keepBottomSafeDis()" class="suction_bottom_btn">
      <Button :disabled="!form.businessLicense" size="L" @confirm="submitFn">提交后去授权签约</Button>
    </div>
  </div>
</template>
<script lang="ts" setup>
import Image from '@C/Image.vue'
import { reactive, watch } from 'vue'
import Upload from '@C/Upload.vue'
import Button from '@C/Button.vue'
import { bottomStaySpace, keepBottomSafeDis, onLoad, onShow, onUnload, Router, storeCommit } from '@U/common'
import { Msg, MsgLoading, MsgLoadingClear } from '@C/Msg'
import { ocr_license } from '@P/Auth/request'
import { getShouDaoStudioInfo, getStudioAutoSignLink, studioUploadBusinessLicense } from './request'

const form = reactive({
  id: '',
  studioName: '',
  creditCode: '',
  businessLicense: '',
})
// 营业执照OCR
watch(
    () => form.businessLicense,
    async (newVal: string) => {
      if (newVal) {
        await MsgLoading('识别中')
        const { data } = await ocr_license({ imgPath: newVal }).finally(() => MsgLoadingClear())
        form.studioName = data.companyName
        form.creditCode = data.businessLicenceNo
      }
    },
)
onLoad((option: any) => {
  form.id = option.id
})
let setInterId = 0
let isFirstClick: boolean
onShow(() => {
  isFirstClick = true
})
const submitFn = async () => {
  if (!form.businessLicense) return
  if (isFirstClick) {
    isFirstClick = false
    await MsgLoading()
    const { code } = await studioUploadBusinessLicense(form).finally(() => {})
    if (code === 200) {
      MsgLoadingClear()
      setInterId = setInterval(async () => {
        Msg({ msg: '资料审核中，请稍候' })
        const res = await getShouDaoStudioInfo({ id: form.id }).finally(() => {})
        if (res?.code === 200) {
          if (res.data?.profileStatus === 2) {
            clearInterval(setInterId)
            await MsgLoading()
            const res1 = await getStudioAutoSignLink({ id: form.id }).finally(() => {})
            if (res1?.code === 200) {
              uni.hideLoading()
              storeCommit('contractPath', res1.data)
              Router.push('webviewPreview')
            }
          }
          if (res.data?.profileStatus === 3) {
            clearInterval(setInterId)
            Msg({ msg: '资料审核不通过，请联系客服' })
            setTimeout(() => {
              Router.back()
            }, 2000)
          }
        }
      }, 2000)
    } else isFirstClick = true
  }
}
onUnload(() => {
  clearInterval(setInterId)
})
</script>

<style lang="less" scoped>
.wrap {
  padding: 24rpx;
  background-color: #fff;
  .title {
    font-weight: 500;
    font-size: 32rpx;
    color: rgba(0,0,0,0.85);
    line-height: 44rpx;
    padding-left: 12rpx;
  }
  .tip {
    font-weight: 400;
    font-size: 28rpx;
    color: rgba(0,0,0,0.25);
    line-height: 40rpx;
  }
}
</style>
